<template>
  <div class="table_layout ">
    <div class="table_title" flex="main:justify cross:center">
      <div flex>
        <p>创建人：{{ tableData.creator || '--' }}</p>
        <p style="margin-left:20px">创建时间：{{ tableData.createTime || '--' }}</p>
      </div>
      <div>
        <template v-if="!patternIsEdit">
          <el-button class="margin_left_10" type="primary" plain size="mini" @click="showShare = true">分享</el-button>
          <el-button class="margin_left_10" size="mini">打印</el-button>
          <el-button v-if="$store.state.archives.flag !== 2" class="margin_left_10" size="mini" type="warning" plain @click="patternIsEdit = true">编辑</el-button>
        </template>
        <template v-else>
          <el-button class="margin_left_10" size="mini" plain type="success" :loading="loading" @click="handleSave">保存</el-button>
          <el-button class="margin_left_10" size="mini" plain type="danger" @click="handleGetData">取消</el-button>
        </template>
      </div>
    </div>
    <div class="table_containter">
      <div class="container_title">
        <p>{{ $store.state.user.departmentName }}</p>
        <h1>案件移交通知书</h1>
      </div>
      <div class="text"><input v-if="patternIsEdit" v-model="tableData.brigade" type="text" class="custom_input">
        <span v-else class="custom_input">{{ tableData.brigade }}</span>：</div>
      <div class="table_content_text">
        我单位于 <input v-if="patternIsEdit" v-model="tableData.caseTime" type="date" class="custom_input">
        <span v-else class="custom_input">{{ comCaseTime }}</span>
        受理的 <input v-if="patternIsEdit" v-model="tableData.caseName" style="width:210px" type="text" class="custom_input">
        <span v-else class="custom_input">{{ tableData.caseName }}</span>
        一案（受案登记表文号 <input v-if="patternIsEdit" v-model="tableData.no" type="text" class="custom_input">
        <span v-else class="custom_input">{{ tableData.no }}</span>）。
        经审查，根据案件管辖分工，该案属于你单位管辖范围，根据 《公安机关办理行政案件程序规定》第四十七条第一款第二项之规定，现移送你单位处理
        附：<span>证据清单（略）</span>
      </div>
      <div class="text text_align_right" style="margin-top:40px">
        xx县公安消防大队（印）
      </div>
      <div class="text text_align_right" style="margin-bottom:60px">
        <input v-if="patternIsEdit" v-model="tableData.btime" type="date" class="custom_input">
        <span v-else class="custom_input">{{ parseTime(tableData.btime,'{y}年{m}月{d}日') }}</span>
      </div>
      <div class="text" flex="main:justify">
        <div flex>
          <div>接收人员：</div>
          <div>
            <input v-if="patternIsEdit" v-model="tableData.receive" type="text" class="custom_input">
            <span v-else class="custom_input">{{ tableData.receive }}</span> <br>
            <input v-if="patternIsEdit" v-model="tableData.runit" type="text" class="custom_input">
            <span v-else class="custom_input">{{ tableData.runit }}</span> <br>
            <input v-if="patternIsEdit" v-model="tableData.rtime" type="date" class="custom_input">
            <span v-else class="custom_input">{{ parseTime(tableData.rtime,'{y}年{m}月{d}日') }}</span>
          </div>
        </div>
        <div flex="main:justify">
          <div>举报人：</div>
          <div>
            <input v-if="patternIsEdit" v-model="tableData.informer" type="text" class="custom_input">
            <span v-else class="custom_input">{{ tableData.informer }}</span> <br>
            <input v-if="patternIsEdit" v-model="tableData.itime" type="date" class="custom_input">
            <span v-else class="custom_input">{{ parseTime(tableData.itime,'{y}年{m}月{d}日') }}</span>
          </div>
        </div>
      </div>
    </div>
    <!-- <transition name="el-zoom-in-center">
      <div v-show="patternIsEdit" class="table_shade" />
    </transition> -->
    <shareComponent v-model="showShare" />
  </div>

</template>

<script>
import { parseTime } from '@/utils/time'
// import { requestSave, requestGetById } from '@/api/home'
import shareComponent from './share'
export default {
  components: { shareComponent },
  data() {
    return {
      showShare: false,
      patternIsEdit: false,
      loading: false,
      url: '/transferNotic',
      tableData: {
        'archivesId': 0,
        'brigade': 'string',
        'btime': parseTime(new Date(), '{y}-{m}-{d}'),
        'caseName': 'string',
        'caseNo': 'string',
        'caseTime': parseTime(new Date(), '{y}-{m}-{d}'),
        'flag': 0,
        'id': 0,
        'informer': 'string',
        'itime': parseTime(new Date(), '{y}-{m}-{d}'),
        'no': 'string',
        'receive': 'string',
        'rtime': parseTime(new Date(), '{y}-{m}-{d}'),
        'runit': 'string',
        'title': 'string'
      }
    }
  },
  computed: {
    comCaseTime() {
      return parseTime(this.tableData.caseTime, '{y}年{m}月{d}日')
    }
  },
  created() {
    this.handleGetData()
  },
  methods: {
    handleSave() {
      const formData = JSON.parse(JSON.stringify(this.tableData))
      formData.archivesId = this.$route.query.archivesId

      formData.btime = `${formData.btime} 00:00:00`
      formData.caseTime = `${formData.caseTime} 00:00:00`
      formData.itime = `${formData.itime} 00:00:00`
      formData.rtime = `${formData.rtime} 00:00:00`

      formData.title = '案件移交通知书'
      requestSave(formData, this.url).then(res => {
        this.$message.success('操作成功')
        this.$router.replace({ path: this.$route.path, query: { itemId: res.data, ...this.$route.query, isEdit: false }})
        this.handleGetData()
      })
    },
    handleGetData(come) {
      const itemId = this.$route.query.itemId
      this.patternIsEdit = come ? false : JSON.parse(this.$route.query.isEdit || 'false')
      if (!itemId) return
      requestGetById({ id: itemId }, this.url).then(res => {
        const formData = res.data
        formData.btime = parseTime(formData.btime, '{y}-{m}-{d}')
        formData.caseTime = parseTime(formData.caseTime, '{y}-{m}-{d}')
        formData.itime = parseTime(formData.itime, '{y}-{m}-{d}')
        formData.rtime = parseTime(formData.rtime, '{y}-{m}-{d}')
      })
    }

  }
}
</script>

